<template>
  <div class="registerSubmit">
    <ReturnBack></ReturnBack>
    <van-form @submit="onSubmit">
     <VerificationCode @changeSms="changeSms"></VerificationCode>
    <van-field
      v-model="username"
      name="用户名"
      left-icon="user-circle-o"
      placeholder="请输入用户名"
    />
    <van-field
      v-model="password"
      type="password"
      name="密码"
      left-icon="bag-o"
      placeholder="请输入密码"
    />
    <van-field
      v-model="password2"
      type="password"
      name="密码"
      left-icon="bag-o"
      placeholder="请再次输入密码"
    />
    <div style="margin: 16px;">
      <van-button round block type="info" native-type="submit" style="border:none;
      background-color:#ee0a24;border-radius:5px;margin-top:.3rem">确定</van-button>
    </div>
    <!-- <van-popup v-model="show" overlay class="text">{{ msg }}</van-popup> -->
  </van-form>
  </div>
</template>

<script>
// import axios from 'axios'
// import beas from '@/views/Address-the-set/url.js'
import { addUser } from '@/api/handpick'
import VerificationCode from '@/components/verification.vue'
import ReturnBack from '@/components/return.vue'
export default {
  name: 'registerSubmit',
  data () {
    return {
      sms: '',
      username: '',
      password: null,
      password2: null,
      show: false,
      msg: '',
      overlay: false
    }
  },
  components: {
    ReturnBack,
    VerificationCode
  },
  mounted () {
    console.log(this.$route.params.phone)
  },
  methods: {
    changeSms (item) {
      this.sms = item
    },
    onSubmit () {
      addUser(this.sms, this.$route.params.phone, this.password, this.password2, this.username).then(res => {
        console.log(res)
        if (res.data.errmsg === '成功') {
          this.$toast.success(res.data.errmsg)
          // token
          window.localStorage.setItem('Authorization', res.data.data.token)
          // 头像
          window.localStorage.setItem('avatar', res.data.data.userInfo.avatarUrl)
        } else {
          this.$toast.fail(res.data.errmsg)
        }
      })
        .catch(err => {
          console.log(err)
        })
      this.show = true
      this.$router.push('/me')
    }
  }
}
</script>

<style lang="scss" scoped>
.van-field {
  margin: .5rem 0;
}
.van-field ::v-deep input{
  padding: 0 .3rem;
}
</style>
